<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
  <style>
    /* <!-- 5.后代选择器 
        1.子代选择器 直接子元素
        2.后代选择器 所有后代 包括子代和其他后代
        5.1子代选择器 使用>隔开 --> */
        .parent>p{
            font-size: 28px;
            color: blue;
            background-color: red;
        } -->
            /* <!-- 5.2选中所有的后代 用空格隔开 --> */
             section div{
                width: 100px;
                height: 100px;
             }
</style>
</head>
<body><section class="parent">
    <p class="first">我是p1</p>
    <p id="second">我是p2</p>
    <p>我是p3</p>
    <p class="first four">我是p4</p>
    <p>段落标签</p>
    <section>块级元素
        <p>我是子代p</p>
        <p>我是子代p</p>
        <p>我是子代p</p>
        <p>我是子代p</p>
        <div>
            <p>我是后代p</p>
            <p>我是后代p</p>
            <p>我是后代p</p>
            <p>我是后代p</p>
        </div>
    </section>
</body>
</html>